<template>
  <div class="home-bg padding-20">
    <WorkTableEvent></WorkTableEvent>
    <div>
      <div class="flex justify-end padding-top-20"><ActButtons></ActButtons></div>
    </div>
    <div class="group-operation-box bg-color-fffff margin-top-20">
      <group-operating-norm @changeTime="changeTime" />
    </div>
    <div class="margin-top-20">
      <flow-rate ref="flowRate" :select-time="selectTime"></flow-rate>
      <flow-rate-table ref="flowRate" :select-time="selectTime" :hasIncome="true" :hasPay="true"></flow-rate-table>
    </div>
    <financial-operation :selectTime="selectTime"/>
  </div>
</template>
<script>
  import dayjs from 'dayjs';
  import groupOperatingNorm from './components/groupOperatingNorm';
  import financialOperation from './components/financialOperation';
  import WorkTableEvent from '@/pages/businessAssets/modeules/workTableEvent';
  import ActButtons from '@/pages/businessAssets/modeules/actButtons';
  import flowRate from "./components/flowRate.vue"
  import flowRateTable from "./components/flowRateTable.vue"
  export default {
    data() {
      return {
        selectTime: dayjs(new Date(new Date().getTime() - 24*30*60*60*1000)).format('YYYY-MM'),
      };
    },
    methods: {
      changeTime(selectTime) {
        this.selectTime = selectTime;
      },
    },
    computed: {},
    components: {
      groupOperatingNorm,
      financialOperation,
      WorkTableEvent,
      ActButtons,
      flowRate,
      flowRateTable
    },
  };
</script>
